<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>显示模式</title>
		<style>
			h4,p,span,del,a,input{
				background-color:pink;
				width:300px;
				height:200px;
				margin:auto;/* 给盒子水平居中 */
				text-align:center;/* 文本居中 */
				
			}
			
		</style>
		a{
			display:block;<!-- 将a标签转换为块元素 -->
			
		}
	</head>
	<body>
	<!-- 	标签的显示模式：
		1.块元素 block：比较霸道，单独占一行
				默认宽度是父级元素宽度的100%
				可以设置宽、高和对齐属性 
				块级元素可以包含行内元素和其他块元素
				文本标签（h1~h6，p）不要再加入块元素
		2.行内元素 inline：一行显示多个
					默认宽度是内容的宽度
					宽、高和对齐属性设置设置无效
					行内元素只包含文本或其他行内元素，一般不包括块级元素。
					链接标签不要再包含其他链接
		3.行内块元素inline-block：一行显示多个
								可以设置宽、高和对齐属性
								默认宽度是内容的宽度
				<input/><img/><td><td/>
				元素显示模式转换：
				display:block/inline/inline-block;
		 -->
		 <h4>小米su7</h4>
		  <p>性能旋风...</p>
		 <span>2399</span>
		 <del>2499</del>
		 <a href="#">百度</a>
		<input type="text"/>
		<input type="passwd"/>
	</body>
</html>
